<div class="InsightsLastCheck"
    ng-show="isCheckingIn=false">
    <i class="fa icon-job-failed InsightsIcon-warning"></i>
    <translate>This machine has not checked in with Insights in {{last_check_in}} hours</translate>
</div>
<div class="InsightsNav">
    <div class="InsightsNav-rightSide">
        <div class="InsightsNav-anchor" ng-click="filterReports('total')"
            ng-class="{'is-currentFilter' : (currentFilter === 'total')}">
            <div class="InsightsNav-badgeTitle"><translate>Total Issues</translate></div>
            <span class="badge List-titleBadge InsightsNav-totalIssues">{{reports_dataset.reports.length}}</span>
        </div>

        <div class="InsightsNav-anchor" ng-click="filterReports('critical')"
            ng-class="{'is-currentFilter' : (currentFilter === 'critical')}"
            ng-show="critical_count>0">
            <div class="InsightsNav-badgeTitle"><translate>Critical</translate></div>
            <span class="badge List-titleBadge InsightsNav-criticalIssues">{{critical_count}}</span>
        </div>
        <div class="InsightsNav-anchor" ng-click="filterReports('high')"
            ng-class="{'is-currentFilter' : (currentFilter === 'high')}"
            ng-show="high_count>0">
            <div class="InsightsNav-badgeTitle"><translate>High</translate></div>
            <span class="badge List-titleBadge InsightsNav-highIssues">{{high_count}}</span>
        </div>
        <div class="InsightsNav-anchor" ng-click="filterReports('medium')"
            ng-class="{'is-currentFilter' : (currentFilter === 'medium')}"
            ng-show="med_count>0">
            <div class="InsightsNav-badgeTitle"><translate>Medium</translate></div>
            <span class="badge List-titleBadge InsightsNav-mediumIssues">{{med_count}}</span>
        </div>
        <div class="InsightsNav-anchor" ng-click="filterReports('low')"
            ng-class="{'is-currentFilter' : (currentFilter === 'low')}"
            ng-show="low_count>0">
            <div class="InsightsNav-badgeTitle"><translate>Low</translate></div>
            <span class="badge List-titleBadge InsightsNav-lowIssues">{{low_count}}</span>
        </div>
    </div>
    <div class="InsightsNav-leftSide">

        <div class="InsightsNav-anchor" ng-click="filterReports('solvable')"
            ng-class="{'is-currentFilter' : (currentFilter === 'solvable')}"
            ng-show="solvable_count>0">
            <div class="InsightsNav-badgeTitle"><translate>Solvable With Playbook</translate></div>
            <span class="badge List-titleBadge InsightsNav-solvableBadge">{{solvable_count}}</span>
        </div>
        <div class="InsightsNav-anchor" ng-click="filterReports('not_solvable')"
            ng-class="{'is-currentFilter' : (currentFilter === 'not_solvable')}"
            ng-show="not_solvable_count>0">
            <div class="InsightsNav-badgeTitle"><translate>No Remediation Playbook Available</translate></div>
            <span class="badge List-titleBadge InsightsNav-solvableBadge">{{not_solvable_count}}</span>
        </div>
        <div ng-click="refresh()">
            <i class="fa fa-refresh InsightsNav-refresh"
                aw-tool-tip="{{ strings.get('tooltips.REFRESH_INSIGHTS') }}" data-placement="left" data-original-title="" title=""
                ng-hide="!insights_credential">
            </i>
        </div>
    </div>
</div>

<div class="InsightsBody">
    <div class="InsightsBody-missingIssues" ng-show="reports.length===0 && insights_credential" translate>
        No data is available. There are no issues to report.
    </div>
    <div class="InsightsBody-missingIssues" ng-show="!insights_credential" translate>
        The Insights Credential for {{inventory.name}} was not found.
    </div>
    <div class="InsightsRow" ng-repeat="report in reports">
        <div class="InsightsRow-title">
            <img class="InsightsIcon" src="/static/assets/i_severity_critical.svg" ng-show="report.rule.severity === 'CRITICAL'"
                aw-tool-tip="Critical Risk" data-placement="right" data-original-title="" title="">
            <img class="InsightsIcon" src="/static/assets/i_severity_high.svg" ng-show="report.rule.severity === 'ERROR'"
                aw-tool-tip="High Risk" data-placement="top" data-original-title="" title="">
            <img class="InsightsIcon" src="/static/assets/i_severity_med.svg" ng-show="report.rule.severity === 'WARN'"
                aw-tool-tip="Medium Risk" data-placement="top">
            <img class="InsightsIcon" src="/static/assets/i_severity_low.svg" ng-show="report.rule.severity === 'INFO'"
                aw-tool-tip="Low Risk" data-placement="top">
            <div class="InsightsRow-description"><translate>ISSUE: {{report.rule.description}}</translate></div>
            <span class="Form-title--is_superuser">{{report.rule.category}}</span>
        </div>
        <div class="InsightsRow-body">{{report.rule.summary}}</div>
        <div ng-repeat="plan in report.maintenance_actions">
            <div class="InsightsRow-plan" ng-bind-html="plan | planFilter"></div>
        </div>
    </div>
</div>

<div class="buttons Form-buttons">
    <button type="button" class="btn btn-sm Form-primaryButton" ng-click="viewDataInInsights()"> <i class="fa fa-sign-out"></i> <translate>VIEW DATA IN INSIGHTS</translate></button>
    <button type="button" class="btn btn-sm Form-primaryButton" ng-click="remediateInventory(inventory.id, insights_credential)" ng-hide="reports.length === 0 || !insights_credential || !canRemediate"> <translate>REMEDIATE INVENTORY</translate></button>
    <button type="button" class="btn btn-sm Form-cancelButton Insights-cancelButton" ng-click="formCancel()"> <translate>Close</translate></button>
</div>
